<template>
<div id="companyInfo">
    <el-descriptions  direction="horizontal" :column="3" size="small" border>
      <template slot="extra">
        <el-button type="primary" size="small" v-show="editAuth" icon="el-icon-edit" @click="dialogFormVisible = true">编辑</el-button>
      </template>
      <el-descriptions-item>
        <template slot="label">
          企业名称
        </template>
        {{ company.companyName }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          注册账号
        </template>
        {{ company.userName }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          企业类型
        </template>
        {{company.companyType==0?'国企':company.companyType==1?'央企':company.companyType?'民营':'外企'}}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          行业
        </template>
        {{ company.industry }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          所在城市
        </template>
        {{codeToCity(company.cityCode)}}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          详细地址
        </template>
        {{ company.address }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          企业logo
        </template>
        <el-image :src=company.companyLogoUrl style="height:40px"></el-image>
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          认证材料
        </template>
        <el-link :href="company.businessLicenseUrl" target="_blank" type="primary" :underline="false" style="font-size:12px">
          认证材料链接
        </el-link>
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          企业规模
        </template>
        {{ company.companyScale }}人
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          联系电话
        </template>
        {{ company.tel }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          联系邮箱
        </template>
        {{ company.email }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          融资上市情况
        </template>
        {{ company.financeList }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          注册资本
        </template>
        {{ company.registeredCapital }}万
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          创立时间
        </template>
        {{ company.buildTime }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          统一社会信用代码
        </template>
        {{ company.uniformCreditCode }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          官网地址
        </template>
        <el-link :href="company.officialWebsiteUrl" target="_blank" type="primary" :underline="false" style="font-size:12px">
          官网链接
        </el-link>
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          招聘官网
        </template>
        <el-link :href="company.recruitUrl" target="_blank" type="primary" :underline="false" style="font-size:12px">
          招聘官网链接
        </el-link>
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          法人
        </template>
        {{ company.legalPerson }}
      </el-descriptions-item>
      <el-descriptions-item :span="3" label-style="width:90px">
        <template slot="label">
          法人信息
        </template>
        {{ company.legalPersonInfo }}
      </el-descriptions-item>
      <el-descriptions-item :span="3" label-style="width:90px">
        <template slot="label">
          经营范围
        </template>
        {{ company.businessScope }}
      </el-descriptions-item>
      <el-descriptions-item  :span="3" label-style="width:90px">
        <template slot="label">
          公司简介
        </template>
        {{ company.companyInfo }}
      </el-descriptions-item>
    </el-descriptions>

  <el-dialog title="企业信息" :visible.sync="dialogFormVisible" :close-on-click-modal=false top="0" width="40%">
    <el-form :model="infoForm" ref="infoForm" :rules="rules" >

      <el-form-item label="企业logo" :label-width="formLabelWidth" prop="logo">
        <el-upload
            ref="upload"
            action="/api/upload/?ser=user"
            :on-success="uploadSuccess"
            :limit="1"
            :auto-upload="true">
          <i class="el-icon-upload"> 点击上传</i>
        </el-upload>
      </el-form-item>
      <el-form-item label="企业规模" :label-width="formLabelWidth" prop="scale">
        <el-input type="number" v-model="infoForm.scale" autocomplete="off"></el-input>
      </el-form-item>

      <el-form-item label="联系电话" :label-width="formLabelWidth" prop="tel">
        <el-input v-model="infoForm.tel" autocomplete="off"></el-input>
      </el-form-item>

      <el-form-item label="联系邮箱" :label-width="formLabelWidth" prop="email">
        <el-input v-model="infoForm.email" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="详细地址" :label-width="formLabelWidth" prop="address">
        <el-input  v-model="infoForm.address" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="融资上市情况" :label-width="formLabelWidth" prop="financeList">
        <el-input v-model="infoForm.financeList" autocomplete="off"></el-input>
      </el-form-item>

      <el-form-item label="官网网址" :label-width="formLabelWidth" prop="officialWebsiteUrl">
        <el-input v-model="infoForm.officialWebsiteUrl" autocomplete="off"></el-input>
      </el-form-item>

      <el-form-item label="招聘官网链接" :label-width="formLabelWidth" prop="recruitUrl">
        <el-input v-model="infoForm.recruitUrl" autocomplete="off"></el-input>
      </el-form-item>

      <el-form-item label="法人信息" :label-width="formLabelWidth" prop="legalPersonInfo">
        <el-input type="textarea" :row="50" maxlength="150"  show-word-limit v-model="infoForm.legalPersonInfo" autocomplete="off"></el-input>
      </el-form-item>

      <el-form-item label="营业范围" :label-width="formLabelWidth" prop="businessScope">
        <el-input  type="textarea" :row="50" v-model="infoForm.businessScope" maxlength="150"   show-word-limit autocomplete="off" ></el-input>
      </el-form-item>
      <el-form-item label="公司简介" :label-width="formLabelWidth" prop="companyInfo">
        <el-input  type="textarea" :row="50" v-model="infoForm.companyInfo" maxlength="150"   show-word-limit autocomplete="off" ></el-input>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="dialogFormVisible = false">取 消</el-button>
      <el-button type="primary" @click="save">保 存</el-button>
    </div>
  </el-dialog>
</div>
</template>

<script>
import {CodeToText} from 'element-china-area-data'
import {getCompanyInfo, updateCompanyInfo} from "@/network/companyUser";
export default {
  name: "CompanyInfo",
  data(){
    return{
      editAuth:false,
      company:{},
      loading:true,
      dialogFormVisible:false,
      infoForm: {
        companyName:'',
        logo:'',
        scale:'',
        tel: '',
        email: '',
        address:'',
        officialWebsiteUrl: '',
        financeList: '',
        recruitUrl:'',
        legalPersonInfo:'',
        businessScope:'',
        companyInfo:''
      },
      rules: {
        tel: [{
          pattern: /^((0\d{2,3}-\d{7,8})|(1[34578]\d{9}))$/,
          message: '请输入正确的手机号',
          trigger: 'blur'
        }],
        email:[{pattern:/^([a-zA-Z0-9]+[-_\\.]?)+@[a-zA-Z0-9]+\.[a-z]+$/,message:'请输入正确邮箱格式',trigger:'blur'}]
      },

      formLabelWidth:"120px"
    }

  },
  created() {
    this.getCompanyInfo();

  },
  methods:{
    codeToCity(cityCode){
      return CodeToText[cityCode];
    },
    getCompanyInfo(){
      var companyName = localStorage.getItem("company_companyName");
      getCompanyInfo(companyName).then(res=>{
        this.company = res.data.data;
        if(this.company.userName===localStorage.getItem("company_userName")){
          this.editAuth = true;
        }
      })
    },
    uploadSuccess(res){
      if(res.data!=undefined){
        this.infoForm.logo=res.data;
      }
    },
    save(){
      this.infoForm.companyName = localStorage.getItem("company_companyName");
      console.log(this.infoForm);
      this.$refs.infoForm.validate((valid) => {
        if (valid) {
          updateCompanyInfo(this.infoForm).then(res => {
            this.$message.success(res.data.data);
            this.getCompanyInfo();
          }).catch();
          this.dialogFormVisible = false;
        }
      })
    }
  }
}
</script>

<style scoped>

</style>